<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://www.springframework.org/tags" prefix="spring"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
  <base href="<%=basePath%>">
  <meta charset="utf-8">
  <title>产线查询</title>
  <meta name="renderer" content="webkit">
  <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=0">
  <link rel="stylesheet" href="layuiadmin/layui/css/layui.css" media="all">
  <link rel="stylesheet" href="layuiadmin/style/admin.css" media="all">
  <style type="text/css">
    /*表格单选框居中 */
	.layui-table-cell .layui-form-radio {
		position: relative;
		top: 50%;
	}
	/* 禁止刷新后出现横向滚动条 */
	body{overflow-y: scroll;} 
  </style>
</head>
<body>
	<div class="layui-fluid">
	  <div class="layui-row layui-col-space10">
	  	<div class="layui-col-md4">
			<div class="layui-card">
		      <div class="layui-form layui-card-header layuiadmin-card-header-auto">
		        <div class="layui-form-item">
		          <div class="layui-inline">
		            <label class="layui-form-label">产线编号</label>
		            <div class="layui-input-inline">
		              <input type="text" name="code" id="code" placeholder="请输入产线编号" autocomplete="off" class="layui-input">
		            </div>
		          </div>
		          <div class="layui-inline">
		            <button class="layui-btn layuiadmin-btn-list" lay-submit lay-filter="LAY-workline-contlist-search">
		              <i class="layui-icon layui-icon-search layuiadmin-button-btn"></i>
		            </button>
		          </div>
		        </div>
			</div>
			<div class="layui-card-body">
			  <table id="LAY-workline-content-list" lay-filter="LAY-workline-content-list"></table> 
			  <script type="text/html" id="toolbarDemo">
  				<div class="layui-btn-container">
    				<button class="layui-btn layuiadmin-btn-list" lay-event="add">添加</button>
  				</div>
		  	  </script>
			  <script type="text/html" id="table-content-list">
          			<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑</a>
          			<a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del"><i class="layui-icon layui-icon-delete"></i>删除</a>
          	  </script>
          	  <script type="text/html" id="table-worksection-content-list">
          			<a class="layui-btn layui-btn-normal layui-btn-xs" lay-event="edit"><i class="layui-icon layui-icon-edit"></i>编辑工位机</a>
          	  </script>
	      	</div>
	      </div>
	   </div>
  
       <div class="layui-col-md4">
          <div class="layui-card">
            <div class="layui-card-header">工段信息</div>
            <div class="layui-card-body">
              <table id="LAY-worksection-content-list" lay-filter="LAY-worksection-content-list"></table> 
            </div>
          </div>
       </div>
       
       <div class="layui-col-md4">
          <div class="layui-card">
            <div class="layui-card-header">工位机信息</div>
            <div class="layui-card-body">
              <table id="LAY-workmachine-content-list" lay-filter="LAY-workmachine-content-list"></table> 
            </div>
        </div>
     </div>
  </div>
  </div>
  <script src="layuiadmin/layui/layui.js"></script>  
  <script>
  layui.config({
    base: 'layuiadmin/' //静态资源所在路径
  }).extend({
    index: 'lib/index' //主入口模块
  }).use(['index', 'contlist', 'table', 'laydate'], function(){
    var table = layui.table
    ,admin = layui.admin
    ,laydate = layui.laydate
    ,form = layui.form;
    
    laydate.render({
		elem: '#date', //弹出页的指定元素生日时期需要为时间格式
	});
    
    table.render({
        elem: '#LAY-workline-content-list'
        ,url:'workline/findListJson/'
        ,limit:10
        ,limits:[10,20,30,40,50,60,70,80,90]
        ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
        ,toolbar: '#toolbarDemo'
        ,cols: [[
           {type:'radio'}
		  ,{field:'code', title: '产线编号', sort: true}
          ,{field:'name', title: '产线名称', sort: true}
          ,{fixed: 'right', title:'操作', toolbar: '#table-content-list', width:150}
        ]]
    	,page: true
    	,done: function(res, curr, count){
        	initWorksectionTable();
    	}
	    ,parseData: function(res){ //res 即为原始返回的数据
	    	if(res.data[0] != undefined){    
	    		res.data[0].LAY_CHECKED=true
		        return {
		         "code": res.code, //解析接口状态
		         "msg": res.msg, //解析提示文本
		         "count": res.count, //解析数据长度
		         "data": res.data //解析数据列表
		       };
	    	}
	     }
      });
    
    //监听搜索
    form.on('submit(LAY-workline-contlist-search)', function(data){
      var field = data.field;
      //执行重载
      table.reload('LAY-workline-content-list', {
        where: field
        ,page: {
            curr: 1 //重新从第 1 页开始
        }
      });
    });
    
    //监听产线行单击事件（双击事件为：rowDouble）
    table.on('row(LAY-workline-content-list)', function(obj) { //注：test是table原始容器的属性 lay-filter="对应的值"
    	var data = obj.data;
    	//选中行样式
    	obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
    	//选中radio样式
    	obj.tr.find('i[class="layui-anim layui-icon"]').trigger("click");
    	
    	//重载工具表格数据
        table.reload('LAY-worksection-content-list', {
          where: {linecode:data.code}
        });
    });

    
    //监听表格事件
    table.on('tool(LAY-workline-content-list)', function(obj){
      var data = obj.data;
      if(obj.event === 'detail'){
        layer.msg('ID：'+ data.id + ' 的查看操作');
      } else if(obj.event === 'del'){
        layer.confirm('确定删除 '+data.code + '?', function(index){
        	layer.msg('正在提交请稍候。。。', {icon: 16,time:'-1',shade : [0.5 , '#000' , true]});
        	admin.req({
        		url: 'workline/delete' //实际使用请改成服务端真实接口
       	        ,data: data
       	        ,done: function(res){
       	         	if(res.flag==1){
       	         		layer.msg('删除成功');
       			  	}else{
       			  		layer.msg('删除失败');
       			  	}
       	         	table.reload('LAY-workline-content-list');
       	         }
             });
        });
      } else if(obj.event === 'edit'){
    	  layer.open({
              type: 2
              ,title: '修改产线'
              ,content: 'workline/updateInit?id='+data.id
              ,maxmin: true
              ,area: ['900px', '500px']
              ,btn: ['确定', '取消']
              ,yes: function(index, layero){
                //点击确认触发 iframe 内容中的按钮提交
                var submit = layero.find('iframe').contents().find("#layuiadmin-workline-form-submit");
                submit.click();
              }
	          ,end: function () {
	          	table.reload('LAY-workline-content-list');
	          }
            });
      }
    });
    
    //头工具栏事件
    table.on('toolbar(LAY-workline-content-list)', function(obj){
      switch(obj.event){
        case 'batchdel': //批量删除
        	var ids = [];//封装批量删除的ID
            var checkStatus = table.checkStatus(obj.config.id);
            var data = checkStatus.data;
            if(data.length === 0){
                return layer.msg('请选择数据');
            }
	        layer.confirm('确定批量删除选中项 ?', function(index){
	        	layer.msg('正在提交请稍候。。。', {icon: 16,time:'-1',shade : [0.5 , '#000' , true]});
	          	admin.req({
	          		    url: 'workline/deleteBatch' //实际使用请改成服务端真实接口
	         	        ,data: JSON.stringify(data)
	         	        ,type: 'POST'
	         	        ,contentType: "application/json;charset-UTF-8"
	         	        ,done: function(res){
	         	         	if(res.flag==1){
	         	         		layer.msg('删除成功');
	         			  	}else{
	         			  		layer.msg('删除失败');
	         			  	}
	         	         	//关闭网页
	        	          	layer.close(index);
	         	         	table.reload('LAY-workline-content-list');
	         	         }
	               });
	        });
        break;
        case 'add':  //添加
        	layer.open({
                type: 2
                ,title: '添加产线'
                ,content: 'workline/addInit'
                ,maxmin: true
                ,area: ['900px', '500px']
                ,btn: ['确定', '取消']
                ,yes: function(index, layero){
                  //点击确认触发 iframe 内容中的按钮提交
                  var submit = layero.find('iframe').contents().find("#layuiadmin-workline-form-submit");
                  submit.click();
                }
	        	,end: function () {
	        		table.reload('LAY-workline-content-list');
	            }
              });
        break;
        
        case 'worksection':  //工具归还
        	var checkStatus = table.checkStatus(obj.config.id);
		    var data = checkStatus.data;
            
            if(data.length === 0){
                return layer.msg('请选择数据');
            }
            
            if(data[0].inoutstatus == '归还'){
            	 return layer.msg('该记录已经归还!');
            }
            
        	layer.open({
                type: 2
                ,title: '工段工位信息'
                ,content: 'workline/findWorksectioninfo?id='+data[0].id
                ,maxmin: true
                ,area: ['900px', '550px']
                ,btn: ['确定', '取消']
                ,yes: function(index, layero){
                  //点击确认触发 iframe 内容中的按钮提交
                  var submit = layero.find('iframe').contents().find("#layuiadmin-toolinout-form-submit");
                  submit.click();
                }
	        	,end: function () {
	        		table.reload('LAY-toolinout-content-list');
	            }
              });
        break;
        
      };
    });
    
    //初始化工段信息
    function initWorksectionTable(){
    	 //初始化工段信息
        table.render({
            elem: '#LAY-worksection-content-list'
            ,url:'workline/findWorklinesectionListJson'
            ,where:selectWorklinecode()
            ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            ,limit:10
            ,limits:[10,20,30,40,50,60,70,80,90]
            ,cols: [[
      		   {type:'radio'}
      		  ,{field:'sectioncode', title: '工段编号', sort: true}
      		  ,{field:'sectionname', title: '工段名称', sort: true}
      		  ,{fixed: 'right', title:'操作', toolbar: '#table-worksection-content-list', width:150}
            ]]
        	,page: true
        	,done: function(res, curr, count){
        		initWorkmachineTable();
        	}
    	    ,parseData: function(res){ //res 即为原始返回的数据
    	    	if(res.data[0] != undefined){      
    	    		res.data[0].LAY_CHECKED=true
	    	        return {
	    	         "code": res.code, //解析接口状态
	    	         "msg": res.msg, //解析提示文本
	    	         "count": res.count, //解析数据长度
	    	         "data": res.data //解析数据列表
	    	        };
    	    	}
    	     }
        });
    }
    
    //将表单数据转为json
	function selectWorklinecode(){
		//获取选中的流水线
		var checkStatus = table.checkStatus('LAY-workline-content-list');
	    var data = checkStatus.data;
	    var linecode = data[0].code;
    	if(linecode == undefined){
    		linecode = -100;
    	}
		var json = {
			linecode:linecode,
		};
		
		return json;
	}
    
    //监听工段行单击事件（双击事件为：rowDouble）
    table.on('row(LAY-worksection-content-list)', function(obj) { //注：test是table原始容器的属性 lay-filter="对应的值"
    	var data = obj.data;
    	//选中行样式
    	obj.tr.addClass('layui-table-click').siblings().removeClass('layui-table-click');
    	//选中radio样式
    	obj.tr.find('i[class="layui-anim layui-icon"]').trigger("click");
    	
    	//重载工具表格数据
        table.reload('LAY-workmachine-content-list', {
        where: {
      	      	linecode:data.linecode,
      	  	  	sectioncode:data.sectioncode
      	  	 }
      });
    });
    
    //监听表格事件
    table.on('tool(LAY-worksection-content-list)', function(obj){
      var data = obj.data;
     if(obj.event === 'edit'){
    	  layer.open({
              type: 2
              ,title: '修改产线关联的工位机'
              ,content: 'workline/updatemachineInit?id='+data.id
              ,maxmin: true
              ,area: ['900px', '500px']
              ,btn: ['确定', '取消']
              ,yes: function(index, layero){
                //点击确认触发 iframe 内容中的按钮提交
                var submit = layero.find('iframe').contents().find("#layuiadmin-workmachine-form-submit");
                submit.click();
              }
	          ,end: function () {
	          	table.reload('LAY-workmachine-content-list');
	          }
            });
      }
    });
    
    //初始化工位机信息
    function initWorkmachineTable(){
    	 //初始化工位机信息
        table.render({
            elem: '#LAY-workmachine-content-list'
            ,url:'workline/findWorkmachineListJson/'
            ,cellMinWidth: 80 //全局定义常规单元格的最小宽度，layui 2.2.1 新增
            ,where:selectWorksectioncode()
            ,limit:10
            ,limits:[10,20,30,40,50,60,70,80,90]
            ,cols: [[
      		   {field:'machinecode', title: '工位机编号', sort: true}
      		  ,{field:'serialnumber', title: '顺序号', sort: true, edit: 'text'}
            ]]
        	,page: true
        });
    }
    
  //监听单元格编辑
    table.on('edit(LAY-workmachine-content-list)', function(obj){
      var value = obj.value //得到修改后的值
      ,data = obj.data //得到所在行所有键值
      ,field = obj.field; //得到字段
      
      //layer.msg('[ID: '+ data.id +'] ' + field + ' 字段更改为：'+ value);
      
      if(!(/(^[1-9]\d*$)/.test(value))){
  	    layer.msg('只能输入正整数！');
  	    return;
      }
      
      layer.msg('正在提交请稍候。。。', {icon: 16,time:'-1',shade : [0.5 , '#000' , true]});
      
      admin.req({
  		url: 'workline/updateOrdering' //实际使用请改成服务端真实接口
 	        ,data: data
 	        ,done: function(res){
 	         	if(res.flag==1){
 	         		layer.msg(res.msg);
 			  	}else{
 			  		layer.msg('保存失败');
 			  	}
 	         	table.reload('LAY-workmachine-content-list');
 	         }
       });
      
    });
    
    //将表单数据转为json
	function selectWorksectioncode(){
		//获取选中的流水线
		var checkStatus = table.checkStatus('LAY-worksection-content-list');
	    var data = checkStatus.data;
	    var linecode = data[0].linecode;
	    if(linecode == undefined){
    		linecode = -100;
    	}
	    var sectioncode = data[0].sectioncode;
	    if(sectioncode == undefined){
	    	sectioncode = -100;
    	}
		var json = {
			linecode:linecode,
			sectioncode:sectioncode,
		};
		return json;
	}
    
  });
 
  </script>
</body>
</html>